import { Tabs } from 'antd';
import React from 'react';
import map from 'lodash/map';
import toLower from 'lodash/toLower';
import CodeEditor from '@/components/CodeEditor';

function CustomTaskContent({ content }) {
  return (
    <Tabs>
      {map(content, ({ format, value }, key) => (
        <Tabs.TabPane tab={key} key={key}>
          <CodeEditor data={value} mode={toLower(format)} readOnly height={550} />
        </Tabs.TabPane>
      ))}
    </Tabs>
  );
}

export default CustomTaskContent;
